layui.config({
    base: ctx+'/plugin/treetable/'
}).extend({
    treetable: '/treetable',
}).use(['table','form','treetable','layer','tree'], function () {
	var form = layui.form;
	var tree = layui.tree;
    var treetable = layui.treetable;
    var layer = layui.layer;
    var table = layui.table;
    //渲染组织树
    function createUlTree(){
    	 commons.ajax({
	    	url : ctx+'/sys/dept/tree',
	    	success : function(res){
    			var nodes = res.data;
    			layui.tree({
    				  elem: '#ultree' //传入元素选择器
    				  ,nodes: nodes,
    				  click : function(data){
    					  $('#deptSelect').find('span').html(data.name);
    					  $('#parentId').val(data.id);
    					  layer.close(layerIndex);
    				  }
    			});
	    	}
    	});
    }
   
    createUlTree();
    
    var layerIndex ;
    
    //选择组织树
    $('#deptSelect').click(function(){
    	layerIndex = layer.open({
  		  title : '选择部门',
  		  type: 1,
  		  area: ['300px', '200px'],
  		  content: $('#uldialog') 
    	});
    });
    
    // 渲染表格
    var renderTable = function () {
    	 layer.load(2);
    	 treetable.render({
    	        treeColIndex: 1,          
    	        treeSpid: 0,             
    	        treeIdName: 'id',       
    	        treePidName: 'pid',     
    	        treeDefaultClose: false,   
    	        treeLinkage: true,       
    	        elem: '#deptTree',
    	        toolbar : '#toolbar',
    	        defaultToolbar :[],
    	        url: ctx+'/sys/dept/list',
    	        cols: [[ //表头
    	             {field: 'id', title: 'ID',hide : true}
    	            ,{field: 'name', title: '名称', width:'30%',align:'left'}
    	            ,{field: 'remark', title: '备注信息', width:'15%',align:'center'}
    	            ,{field: 'operator', title: '操作人', width:'15%',align:'center'}
    	            ,{field: 'operateTime', title: '操作时间', width:'20%',align:'center'}
    	            ,{field: 'ops', title: '操作', width:'30%',align:'center',
    	            	templet: '#tool'}
    	          ]],
    	       done: function () {
                  layer.closeAll('loading');
               }
    	    });
    }
   
    renderTable();
    
    table.on('tool(deptTree)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
    	  var data = obj.data; //获得当前行数据
    	  var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
    	  var tr = obj.tr; //获得当前行 tr 的DOM对象
    	 
    	  if(layEvent === 'edit'){ 
    		 deleteDept(data.id);
    	  } else if(layEvent === 'save'){ 
    		  layer.msg('save');
    	  } else if(layEvent === 'delete'){ 
    		  deleteDept(data.id);
    	  }
    });
    
    table.on('toolbar(deptTree)', function(obj){
    	var layEvent = obj.event;
    	if(layEvent == 'add'){
    		addDept();
    	}
    });
    
    // 删除部门
    function deleteDept(id){
    	layer.confirm('确定要删除该部门吗?', {icon: 3, title:'提示'}, function(index){
    		commons.ajax({
        		url : ctx+'/sys/dept/delete',
        		data :{
        			id : id
        		},
        		success : function(res){
    				layer.msg(res.msg);
    				renderTable();
        		}
        	});
    		layer.close(index);
    	});
    }
    
    // 新增部门
    function addDept(){
    	layer.open({
    		  title : '新增部门信息',
    		  type: 1,
    		  area: ['500px', '400px'],
    		  content: $('#addDept')
    	});
    }
    
    // 提交新增表单
    form.on('submit(*)', function(data){
    	  commons.ajax({
    		  url : ctx+'/sys/dept/add',
    		  data : data.field,
    		  success : function(res){
				  layer.closeAll();
				  //刷新内容
				  renderTable();
				  commons.endTree('ultree');
				  createUlTree();
				  formReset();
    		  }
    	  });
    	  return false; 
    });
    
    // 清空标签的内容
    function formReset(){
    	$('#reset').click();
    }
    
    // 重置按钮配置上清除部门树的功能
    $('#reset').click(function(){
    	$('#deptSelect').find('span').html('默认为顶级部门');
    });
    
});

